﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Parties.aspx.cs" Inherits="CRMWeb.Pages.AM.Parties" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <div style="float: left; width: 100%">
        <input type="hidden" id="hdnloanid" />
        <table style="width: 100%;">
            <tr>
                <td style="vertical-align: top; width: 100%;">
                    <div id="divPartiesMsg"></div>
                    <div class="topform_section">
                        <div class="firstform_section" style="width: 40%;">
                            <div class="ftitle">PARTIES</div>
                            <div class="fitem">
                                <label>Title:</label>
                                <input id="txtTitle" style="width: 150px;" class="easyui-validatebox" name="Title" />
                            </div>
                            <div class="fitem">
                                <label>Name:</label>
                                <input id="txtName" style="width: 150px;background-color: LightGray;" class="easyui-validatebox" name="Name" disabled="disabled" />
                                <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#dlgFullName').dialog('open')">...</a>
                            </div>
                            <div class="fitem">
                                <label>Role:</label>
                                <input id="txtRole" style="width: 150px;" class="easyui-validatebox" name="Role" />
                            </div>
                            <div class="fitem">
                                <label>Relationship:</label>
                                <input id="txtRelationship" style="width: 150px;" class="easyui-validatebox" name="Relationship" />
                            </div>
                            <div class="fitem">
                                <label>DOB:</label>
                                <input id="txtDOB" name="DOB" class="easyui-datebox" data-options="formatter:formatLoanDate" style="width: 90px;" />
                            </div>
                            <div class="ftitle">CONTACT DETAILS</div>
                            <div class="fitem">
                                <label>Mobile Phone</label>
                                <input id="txtMobilePhone" style="width: 150px;" class="easyui-validatebox" name="MobilePhone" />
                            </div>
                            <div class="fitem">
                                <label>Home Phone:</label>
                                <input id="txtHomePhone" style="width: 150px;" class="easyui-validatebox" name="HomePhone" />
                            </div>
                            <div class="fitem">
                                <label>Work Phone:</label>
                                <input id="txtWorkPhone" style="width: 150px;" class="easyui-validatebox" name="WorkPhone" />
                            </div>
                            <div class="fitem">
                                <label>Fax Number:</label>
                                <input id="txtFaxNumber" style="width: 150px;" class="easyui-validatebox" name="FaxNumber" />
                            </div>
                            <div class="fitem">
                                <label>Email Address 1:</label>
                                <input id="txtEmail1" style="width: 150px;" class="easyui-validatebox" name="EmailAddress1" />
                            </div>
                            <div class="fitem">
                                <label>Email Address 2:</label>
                                <input id="txtEmail2" style="width: 150px;" class="easyui-validatebox" name="EmailAddress2" />
                            </div>
                            <div class="fitem">
                                <label>Home Address:</label>
                                <input id="txtHomeAddress" style="width: 150px;background-color: LightGray;" class="easyui-validatebox" name="HomeAddress" disabled="disabled" />
                                <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#dlgHomeAddress').dialog('open')">...</a>
                            </div>
                            <div class="fitem">
                                <label>Postal Address:</label>
                                <input id="txtPostalAddress" style="width: 150px;" class="easyui-validatebox" name="PostalAddress" />
                            </div>
                        </div>
                        <div class="firstform_section" style="width: 40%;">
                            <div class="fitem">
                                <label>Income Type:</label>
                                <select id="txtIncomeType" class="easyui-combobox" data-options="panelHeight:'auto',editable:false" name="IncomeType" style="width: 150px;">
                                    <option value="Employee">Employee</option>
                                    <option value="Self Employed">Self Employed</option>
                                </select>
                            </div>
                            <div id="selfemployed">
                                <div class="fitem">
                                    <label>Type of Entity:</label>
                                    <input id="txtTypeofEntity" style="width: 150px;" class="easyui-validatebox" name="TypeofEntity" />
                                </div>
                                <div class="fitem">
                                    <label>Business Name:</label>
                                    <input id="txtBusinessName" style="width: 150px;" class="easyui-validatebox" name="BusinessName" />
                                </div>
                                <div class="fitem">
                                    <label>ABN:</label>
                                    <input id="txtABN" style="width: 150px;" class="easyui-validatebox" name="ABN" />
                                </div>
                                <div class="fitem">
                                    <label>Nature of Business:</label>
                                    <input id="txtNatureofBusiness" style="width: 150px;" class="easyui-validatebox" name="NatureofBusiness" />
                                </div>
                                <div class="fitem">
                                    <label>Phone:</label>
                                    <input id="txtPhone" style="width: 150px;" class="easyui-validatebox" name="Phone" />
                                </div>
                                <div class="fitem">
                                    <label>Address:</label>
                                    <input id="txtAddress" style="width: 150px;" class="easyui-validatebox" name="Address" />
                                </div>
                            </div>
                            <div id="employee">
                                <div class="fitem">
                                    <label>Employer:</label>
                                    <input id="txtEmployer" style="width: 150px;" class="easyui-validatebox" name="Employer" />
                                </div>
                                <div class="fitem">
                                    <label>Occupation:</label>
                                    <input id="txtOccupation" style="width: 150px;" class="easyui-validatebox" name="Occupation" />
                                </div>
                                <div class="fitem">
                                    <label>Job Position:</label>
                                    <input id="txtJobPosition" style="width: 150px;" class="easyui-validatebox" name="JobPosition" />
                                </div>
                                <div class="fitem">
                                    <label>Employer Phone:</label>
                                    <input id="txtEmployerPhone" style="width: 150px;" class="easyui-validatebox" name="EmployerPhone" />
                                </div>
                                <div class="fitem">
                                    <label>Contact Person:</label>
                                    <input id="txtContactPerson" style="width: 150px;" class="easyui-validatebox" name="ContactPerson" />
                                </div>
                                <div class="fitem">
                                    <label>Work Address:</label>
                                    <input id="txtWorkAddress" style="width: 150px;" class="easyui-validatebox" name="WorkAddress" />
                                </div>
                            </div>
                            <div class="ftitle">NEXT OF KINS</div>
                            <table style="width: 100%;">
                                <tr>
                                    <td>
                                        <div class="fitem">
                                            <label>Name:</label>
                                            <input id="txtKinsName" style="width: 100px;" class="easyui-validatebox" name="KinsName" />
                                        </div>
                                    </td>
                                    <td>
                                        <div class="fitem">
                                            <label>Relationship:</label>
                                            <input id="txtKinsRelationship" style="width: 100px;" class="easyui-validatebox" name="KinsRelationship" />
                                        </div>
                                    </td>
                                    <td>
                                        <div class="fitem">
                                            <label>Contact Number:</label>
                                            <input id="txtContactNumber" style="width: 100px;" class="easyui-validatebox" name="KinsContactNumber" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <div class="fitem">
                                            <label>Notes:</label>
                                        </div>
                                        <textarea id="txtNotes" name="Notes" style="width: 100%; height: 120px;"></textarea>
                                    </td>
                                </tr>
                            </table>
                        </div>
                        <div class="firstform_section" style="width: 20%;">
                             <div id="abtnEditParty" class="fitem" style="text-align: right;">
                                <span id="lnkbtnEditParty"><a href="javascript:void(0)" class="easyui-linkbutton" style="width: 100px; text-align: center;" data-options="iconCls:'icon-edit'" onclick="setControlsToEditable()">Edit</a></span>
                            </div>
                            <div id="abtnCancelEditParty" class="fitem" style="text-align: right;">
                                <span id="lnkbtnCancelEditParty"><a href="javascript:void(0)" class="easyui-linkbutton" style="width: 100px; text-align: center;" data-options="iconCls:'icon-cancel'" onclick="setControlsToReadonly()">Cancel</a></span>
                            </div>
                            <div class="fitem" style="text-align: right;">
                                <span id="lnkbtnSaveParty"><a href="javascript:void(0)" class="easyui-linkbutton" style="width: 100px; text-align: center;" data-options="iconCls:'icon-save'" onclick="saveParties()">Save</a></span>
                            </div>
                            <div id="abtnNewParty" class="fitem" style="text-align: right;">
                                <span id="lnkbtnNewParty"><a href="javascript:void(0)" class="easyui-linkbutton" style="width: 100px; text-align: center;" data-options="iconCls:'icon-add'" onclick="newParties()">New</a></span>
                            </div>
                            <div id="abtnCancelParty" class="fitem" style="text-align: right;">
                                <span id="lnkbtnCancelParty"><a href="javascript:void(0)" class="easyui-linkbutton" style="width: 100px; text-align: center;" data-options="iconCls:'icon-cancel'" onclick="cancelParties()">Cancel</a></span>
                            </div>
                            <div class="fitem" style="text-align: right;">
                                <span id="lnkbtnDeleteParty"><a href="javascript:void(0)" class="easyui-linkbutton" style="width: 100px; text-align: center;" data-options="iconCls:'icon-remove'" onclick="deleteParties()">Delete</a></span>
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
        </table>
    </div>
    <div id="dlgFullName" title="Fullname Information" class="easyui-dialog" style="width: 300px; height: 200px; padding: 10px" closed="true" buttons="#dlgFullName-buttons">
        <div class="fitem">
            <label style="width: 120px;">First Name:</label>
            <input id="txtFirstName" type="text" name="FirstName" class="easyui-validatebox" />
        </div>
        <div class="fitem">
            <label style="width: 120px;">Middle Name:</label>
            <input id="txtMiddleName" type="text" name="MiddleName" class="easyui-validatebox" />
        </div>
        <div class="fitem">
            <label style="width: 120px;">Surname:</label>
            <input id="txtSurName" name="SurName" type="text" class="easyui-validatebox" />
        </div>
        <div id="dlgFullName-buttons">
            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="setFullName()">Save</a>
        </div>
    </div>
    <div id="dlgHomeAddress" title="Home Address Information" class="easyui-dialog" style="width: 300px; height: 240px; top:500px; padding: 10px" closed="true" buttons="#dlgHomeAddress-buttons">
        <div class="fitem">
            <label style="width: 120px;">Street:</label>
            <input id="txtStreet" type="text" name="Street" class="easyui-validatebox" />
        </div>
        <div class="fitem">
            <label style="width: 120px;">Suburb:</label>
            <input id="txtSuburb" type="text" name="Suburb" class="easyui-validatebox" />
        </div>
        <div class="fitem">
            <label style="width: 120px;">State:</label>
            <input id="txtState" name="State" type="text" class="easyui-validatebox" />
        </div>
        <div class="fitem">
            <label style="width: 120px;">Post Code:</label>
            <input id="txtPostCode" name="PostCode" type="text" class="easyui-validatebox" />
        </div>
        <div id="dlgHomeAddress-buttons">
            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="setHomeAddress()">Save</a>
        </div>
    </div>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#abtnCancelParty').hide();
            $('#abtnCancelEditParty').hide();
            setControlsToReadonly();
        });

        function setControlsToReadonly() {
            $('#dgSummary').datagrid('selectRow', 0);
            $('#abtnCancelEditParty').hide();
            $('#abtnNewParty').show();
            $('#abtnEditParty').show();
            $("#txtTitle").attr("readOnly",true);
            $('#txtName').attr("readOnly", true);
            $('#txtFirstName').attr("readOnly", true);
            $('#txtMiddleName').attr("readOnly", true);
            $('#txtSurName').attr("readOnly", true);
            $('#txtRole').attr("readOnly", true);
            $('#txtRelationship').attr("readOnly", true);
            $('#txtDOB').attr("disabled", true);
            $('#txtMobilePhone').attr("readOnly", true);
            $('#txtHomePhone').attr("readOnly", true);
            $('#txtWorkPhone').attr("readOnly", true);
            $('#txtFaxNumber').attr("readOnly", true);
            $('#txtEmail1').attr("readOnly", true);
            $('#txtEmail2').attr("readOnly", true);
            $('#txtHomeAddress').attr("readOnly", true);
            $('#txtStreet').attr("readOnly", true);
            $('#txtSuburb').attr("readOnly", true);
            $('#txtState').attr("readOnly", true);
            $('#txtPostCode').attr("readOnly", true);
            $('#txtPostalAddress').attr("readOnly", true);
            $('#txtIncomeType').attr("disabled", true);
            $('#txtTypeofEntity').attr("readOnly", true);
            $('#txtBusinessName').attr("readOnly", true);
            $('#txtABN').attr("readOnly", true);
            $('#txtNatureofBusiness').attr("readOnly", true);
            $('#txtPhone').attr("readOnly", true);
            $('#txtAddress').attr("readOnly", true);
            $('#txtEmployer').attr("readOnly", true);
            $('#txtOccupation').attr("readOnly", true);
            $('#txtJobPosition').attr("readOnly", true);
            $('#txtEmployerPhone').attr("readOnly", true);
            $('#txtContactPerson').attr("readOnly", true);
            $('#txtWorkAddress').attr("readOnly", true);
            $('#txtKinsName').attr("readOnly", true);
            $('#txtKinsRelationship').attr("readOnly", true);
            $('#txtContactNumber').attr("readOnly", true);
            $('#txtNotes').attr("readOnly", true);
        }

        function setControlsToEditable() {
            $('#abtnNewParty').hide();
            $('#abtnEditParty').hide();
            $('#abtnCancelEditParty').show();
            $("#txtTitle").attr("readOnly", false);
            $('#txtFirstName').attr("readOnly", false);
            $('#txtMiddleName').attr("readOnly", false);
            $('#txtSurName').attr("readOnly", false);
            $('#txtRole').attr("readOnly", false);
            $('#txtRelationship').attr("readOnly", false);
            $('#txtDOB').datebox('enable');
            $('#txtMobilePhone').attr("readOnly", false);
            $('#txtHomePhone').attr("readOnly", false);
            $('#txtWorkPhone').attr("readOnly", false);
            $('#txtFaxNumber').attr("readOnly", false);
            $('#txtEmail1').attr("readOnly", false);
            $('#txtEmail2').attr("readOnly", false);
            $('#txtStreet').attr("readOnly", false);
            $('#txtSuburb').attr("readOnly", false);
            $('#txtState').attr("readOnly", false);
            $('#txtPostCode').attr("readOnly", false);
            $('#txtPostalAddress').attr("readOnly", false);
            $('#txtIncomeType').combobox('enable');
            $('#txtTypeofEntity').attr("readOnly", false);
            $('#txtBusinessName').attr("readOnly", false);
            $('#txtABN').attr("readOnly", false);
            $('#txtNatureofBusiness').attr("readOnly", false);
            $('#txtPhone').attr("readOnly", false);
            $('#txtAddress').attr("readOnly", false);
            $('#txtEmployer').attr("readOnly", false);
            $('#txtOccupation').attr("readOnly", false);
            $('#txtJobPosition').attr("readOnly", false);
            $('#txtEmployerPhone').attr("readOnly", false);
            $('#txtContactPerson').attr("readOnly", false);
            $('#txtWorkAddress').attr("readOnly", false);
            $('#txtKinsName').attr("readOnly", false);
            $('#txtKinsRelationship').attr("readOnly", false);
            $('#txtContactNumber').attr("readOnly", false);
            $('#txtNotes').attr("readOnly", false);
        }
            
        function setFullName() {
            $('#txtName').val($('#txtFirstName').val() + ' ' + $('#txtMiddleName').val() + ' ' + $('#txtSurName').val());
            $('#dlgFullName').dialog('close');
        }

        function setHomeAddress() {
            $('#txtHomeAddress').val($('#txtStreet').val() + ' ' + $('#txtSuburb').val() + ' ' + $('#txtState').val() + ' ' + $('#txtPostCode').val());
            $('#dlgHomeAddress').dialog('close');
        }

        function formatLoanDate(value, row) {
            if (value == null)
                return value;
            var date = new Date(value);
            var y = date.getFullYear();
            var m = date.getMonth() + 1;
            var d = date.getDate();
            return (d < 10 ? ('0' + d) : d) + '/' + (m < 10 ? ('0' + m) : m) + '/' + y;
        }

        function IncomeType() {

            if ($('#txtIncomeType').combobox('getValue') == 'Employee') {
                $('#selfemployed').hide();
                $('#employee').show();
            }
            else {
                $('#employee').hide();
                $('#selfemployed').show();
            }
        }
        $('#txtIncomeType').combobox({
            onSelect: function () {
                IncomeType();
            }
        });

        $(document).ready(function () {
            $('#selfemployed').hide();
        });

        function DefaultformatDate(value) {
            dArr = value.split('/');
            return dArr[1] + '/' + dArr[0] + '/' + dArr[2];
        }

        function newParties() {
            $('#abtnNewParty').hide();
            $('#abtnCancelParty').show();
            $('#hdnContactId').val('');
            $('#txtTitle').val('');
            $('#txtName').val('');
            $('#txtFirstName').val('');
            $('#txtMiddleName').val('');
            $('#txtSurName').val('');
            $('#txtRole').val('');
            $('#txtRelationship').val('');
            $('#txtDOB').datebox('setValue', formatLoanDate(null, null));
            $('#txtMobilePhone').val('');
            $('#txtHomePhone').val('');
            $('#txtWorkPhone').val('');
            $('#txtFaxNumber').val('');
            $('#txtEmail1').val('');
            $('#txtEmail2').val('');
            $('#txtHomeAddress').val('');
            $('#txtStreet').val('');
            $('#txtSuburb').val('');
            $('#txtState').val('');
            $('#txtPostCode').val('');
            $('#txtPostalAddress').val('');
            $('#txtIncomeType').combobox('setValue','Employee');
            $('#txtTypeofEntity').val('');
            $('#txtBusinessName').val('');
            $('#txtABN').val('');
            $('#txtNatureofBusiness').val('');
            $('#txtPhone').val('');
            $('#txtAddress').val('');
            $('#txtEmployer').val('');
            $('#txtOccupation').val('');
            $('#txtJobPosition').val('');
            $('#txtEmployerPhone').val('');
            $('#txtContactPerson').val('');
            $('#txtWorkAddress').val('');
            $('#txtKinsName').val('');
            $('#txtKinsRelationship').val('');
            $('#txtContactNumber').val('');
            $('#txtNotes').val('');
            setControlsToEditable();
            $('#abtnCancelEditParty').hide();
        }

        function cancelParties() {
            $('#dgSummary').datagrid('selectRow', 0);
            $('#abtnNewParty').show();
            $('#abtnCancelParty').hide();
            setControlsToReadonly();
        }

        function saveParties() {
            //window.onbeforeunload = null;
            var ContID = $('#hdnContactId').val();
            var AppID = $('#hdnApp_Id').val();
            var cmbTitle = $('#txtTitle').val();
            var txtFirstName = $('#txtFirstName').val();
            var txtMiddleName = $('#txtMiddleName').val();
            var txtSurName = $('#txtSurName').val();
            var txtRole = $('#txtRole').val();
            var txtRelationship = $('#txtRelationship').val();
            var txtDateBirth = DefaultformatDate($('input[name="DOB"]').val());
            var txtMobilePhone = $('#txtMobilePhone').val();
            var txtHomePhone = $('#txtHomePhone').val();
            var txtWorkPhone = $('#txtWorkPhone').val();
            var txtFaxNumber = $('#txtFaxNumber').val();
            var txtEmail1 = $('#txtEmail1').val();
            var txtEmail2 = $('#txtEmail2').val();
            var txtStreet = $('#txtStreet').val();
            var txtSuburb = $('#txtSuburb').val();
            var cmbState = $('#txtState').val();
            var txtPostCode = $('#txtPostCode').val();
            var txtPostalAddress = $('#txtPostalAddress').val();
            var txtIncomeType = $('#txtIncomeType').combobox('getValue');
            var txtTypeofEntity = $('#txtTypeofEntity').val();
            var txtBusinessName = $('#txtBusinessName').val();
            var txtABN = $('#txtABN').val();
            var txtNatureofBusiness = $('#txtNatureofBusiness').val();
            var txtPhone = $('#txtPhone').val();
            var txtAddress = $('#txtAddress').val();
            var txtEmployer = $('#txtEmployer').val();
            var txtOccupation = $('#txtOccupation').val();
            var txtJobPosition = $('#txtJobPosition').val();
            var txtEmployerPhone = $('#txtEmployerPhone').val();
            var txtContactPerson = $('#txtContactPerson').val();
            var txtWorkAddress = $('#txtWorkAddress').val();
            var txtKinsName = $('#txtKinsName').val();
            var txtKinsRelationship = $('#txtKinsRelationship').val();
            var txtContactNumber = $('#txtContactNumber').val();
            var txtNotes = $('#txtNotes').val();

            if (ContID == '') {
                $.ajax({
                    url: '/WebServices/ApplicationContact.ashx?method=PartiesContactAdd',
                    contentType: "application/json; charset=utf-8",
                    data: { 'AppID': AppID, 'Title': cmbTitle, 'FirstName': txtFirstName, 'MiddleName': txtMiddleName, 'SurName': txtSurName, 'Role': txtRole, 'Relationship': txtRelationship, 'DateBirth': txtDateBirth, 'MobilePhone': txtMobilePhone, 'HomePhone': txtHomePhone, 'WorkPhone': txtWorkPhone, 'FaxNumber': txtFaxNumber, 'Email1': txtEmail1, 'Email2': txtEmail2, 'Street': txtStreet, 'Suburb': txtSuburb, 'State': cmbState, 'PostCode': txtPostCode, 'PostalAddress': txtPostalAddress, 'IncomeType': txtIncomeType, 'TypeofEntity': txtTypeofEntity, 'BusinessName': txtBusinessName, 'ABN': txtABN, 'NatureofBusiness': txtNatureofBusiness, 'Phone': txtPhone, 'Address': txtAddress, 'Employer': txtEmployer, 'Occupation': txtOccupation, 'JobPosition': txtJobPosition, 'EmployerPhone': txtEmployerPhone, 'ContactPerson': txtContactPerson, 'WorkAddress': txtWorkAddress, 'KinsName': txtKinsName, 'KinsRelationship': txtKinsRelationship, 'ContactNumber': txtContactNumber, 'Notes': txtNotes },
                    success: function (data) {
                        alert('Party Add Successfully');
                        $('#dgSummary').datagrid('reload');
                    }
                });
            }
            else {
                $.ajax({
                    url: '/WebServices/ApplicationContact.ashx?method=PartiesContactEdit',
                    contentType: "application/json; charset=utf-8",
                    data: { 'ContactID': ContID, 'Title': cmbTitle, 'FirstName': txtFirstName, 'MiddleName': txtMiddleName, 'SurName': txtSurName, 'Role': txtRole, 'Relationship': txtRelationship, 'DateBirth': txtDateBirth, 'MobilePhone': txtMobilePhone, 'HomePhone': txtHomePhone, 'WorkPhone': txtWorkPhone, 'FaxNumber': txtFaxNumber, 'Email1': txtEmail1, 'Email2': txtEmail2, 'Street': txtStreet, 'Suburb': txtSuburb, 'State': cmbState, 'PostCode': txtPostCode, 'PostalAddress': txtPostalAddress, 'IncomeType': txtIncomeType, 'TypeofEntity': txtTypeofEntity, 'BusinessName': txtBusinessName, 'ABN': txtABN, 'NatureofBusiness': txtNatureofBusiness, 'Phone': txtPhone, 'Address': txtAddress, 'Employer': txtEmployer, 'Occupation': txtOccupation, 'JobPosition': txtJobPosition, 'EmployerPhone': txtEmployerPhone, 'ContactPerson': txtContactPerson, 'WorkAddress': txtWorkAddress, 'KinsName': txtKinsName, 'KinsRelationship': txtKinsRelationship, 'ContactNumber': txtContactNumber, 'Notes': txtNotes },
                    success: function () {
                        alert('Party Save Successfully');
                        $('#dgSummary').datagrid('reload');
                        setControlsToReadonly();
                    }
                });
            }
        }

        function deleteParties() {
            var ContID = $('#hdnContactId').val();
            var result = confirm("Are you sure want to Delete This Party");
            if (result) {
                $.ajax({
                    url: '/WebServices/ApplicationContact.ashx?method=DeleteParties',
                    data: { 'ContactID': ContID },
                    success: function () {
                        alert('Delete Party Successfully');
                        $('#dgSummary').datagrid('reload');
                    }
                });
            }
            else
                return;
        }
    </script>
</body>
</html>
